<!--
  Author: 善良的YWJ
  Created by shanliangdeYWJ on 2020/09/09
  File: 05.3解决异步设置值每个组件都是独立的.html
  Description: "
  
   请输入文件描述内容
  
               " 
  Github: https://github.com/shanliangdeYWJ
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
  <meta name="keywords" content="" />
  <meta name="description" content="" />
  <title>05Comment组件</title>
</head>

<body>
  <div id="root"></div>

  <!-- 加载 React。-->
  <!-- 注意: 部署时，将 "development.js" 替换为 "production.min.js"。-->
  <script src="../js/react@16.development.js"></script>
  <script src="../js/react-dom@16.development.js"></script>
  <script src="../js/babel@6.min.js"></script>

  <!-- 加载我们的 React 组件。-->
  <script type="text/babel">
    function Table() {
      return (
        <table border="1">
          <thead>
            <tr>
              <th>类别</th>
              <th>一级分类</th>
              <th>二级分类</th>
              <th>1212</th>
              <th>1212</th>
              <th>1212</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td rowSpan="9">材料</td>
              <td rowSpan="3">家具</td>
              <td>室内家具</td>
              <td>4</td>
              <td>4</td>
              <td>4</td>
            </tr>
            <tr>
              <td>室外家具</td>
              <td>8</td>
              <td>8</td>
              <td>8</td>
            </tr>
            <tr>
              <td>合成家具</td>
              <td>8</td>
              <td>8</td>
              <td>8</td>
            </tr>
            <tr>
              <td rowSpan="3">建材</td>
              <td>10</td>
              <td>11</td>
              <td>11</td>
              <td>11</td>
            </tr>
            <tr>
              <td>13</td>
              <td>14</td>
              <td>14</td>
              <td>14</td>
            </tr>
            <tr>
              <td>13</td>
              <td>14</td>
              <td>14</td>
              <td>14</td>
            </tr>
            <tr>
              <td rowSpan="3">外墙</td>
              <td>15</td>
              <td>16</td>
              <td>16</td>
              <td>16</td>
            </tr>
            <tr>
              <td>17</td>
              <td>18</td>
              <td>18</td>
              <td>18</td>
            </tr>
            <tr>
              <td>17</td>
              <td>18</td>
              <td>18</td>
              <td>18</td>
            </tr>
          </tbody>
        </table>
      )
    }
    ReactDOM.render(
      <Table />,
      document.getElementById('root')
    )
  </script>
</body>

</html>